<template>
	<view>
	<!-- <uni-popup ref="popup" type='bottom' :maskClick="false"> -->
	 <uni-popup ref="popup" type='bottom' :maskClick="false">
		 <view class="popup-wrap">
		 	<view class="popup-header">
		 		<text class="popup-header_item" @click="closeComment">取消</text>
		 		<text class="popup-header_item" @click="submit">发布</text>
		 	</view>
		 	<view class="popup-content">
		 		<textarea class="popup-textarea" v-model="commentsValue" maxlength="200" fixed placeholder="请输入评论内容"/>
		 		<view class="popup-count">{{commentsValue.length}}/200</view>
		 	</view>
		 </view>
	 </uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				commentsValue:''
			};
		},
		methods:{
			//打开评论发布窗口
			openComment(){
				console.log("回复传来")
				this.$refs.popup.open()
			},
			//关闭弹窗
			closeComment(){
				this.$refs.popup.close()
				this.commentsValue=''
			},
			//发布
			submit(){
				console.log("发布")
				if(!this.commentsValue){
					uni.showToast({
						title:"请输入评论内容",
						icon:'none'
					})
					return
				}
				// this.setUpdateComment({content:this.commentsValue, ...this.replyFormData})
				this.$emit('UpdateComment',this.commentsValue)
				this.commentsValue=''
				this.$refs.popup.close()
			},
		}
	}
</script>

<style lang="scss">
	.popup-wrap{
		background-color: #fff;
		
		.popup-header{
			display: flex;
			justify-content: space-between;
			font-size: 14px;
			color:#666;
			border-bottom: 1px #F5F5F5 solid;
			
			.popup-header_item{
				height:50px;
				line-height:50px;
				padding:0 15px;
			}
		}
		.popup-content{
			width:100%;
			padding:15px;
			box-sizing: border-box;
			
			.popup-textarea{
				width:100%;
				height:200px;
			}
			.popup-count{
				display: flex;
				justify-content: flex-end;
				font-size: 12px;
				color:#999;
			}
		}
	}
</style>
